let btn = document.querySelector(".active-left");
// console.log(btn);

let btn1 = document.querySelector(".active-right");
let main = document.querySelector(".right-main");
let main1 = document.querySelector(".content-dark");
btn.onclick = function () {
    main.style.display = "block";
    main1.style.display = "none";
    btn.classList.add("on");
    btn1.classList.remove("on");
}
btn1.onclick = function () {
    main1.style.display = "block";
    main.style.display = "none";
    btn1.classList.add("on");
    btn.classList.remove("on");
};

let img = document.querySelectorAll("form img");
console.log(img);
let input = document.querySelectorAll("form input");
console.log(input);
img.forEach(function (v, i) {
    v.onclick = function () {
        input[i].value = "";
        v.style.display = "none";
    }
});
input.forEach(function (v, i) {
    v.oninput = function () {
        if (v.value.length >= 1) {
            img[i].style.display = "block";
        } else {
            img[i].style.display = "none";
        }
    }
});

let btns = document.querySelector(".btn");
let input1 = document.querySelector(".main-username input");
let input2 = document.querySelector(".main-pwd input");
let box = document.querySelector(".form-box");

let isNameAllow = false;
btns.onclick = function () {
    if (input1.value.length >= 6) {
        isNameAllow = true;
    } else {
        box.style.display = "block"
        box.innerText = "用户名格式不正确"
        isNameAllow = false;
        setTimeout(function () {
            box.style.display = "none";
        }, 3000)
    }
    if (isNameAllow) {
        if (input2.value.length >= 6) {
            box.style.display = "block"
            box.innerText = "登录成功"
            setTimeout(function () {
                location.href = "../pages/index.html"
            }, 3000)
        } else {
            box.style.display = "block"
            box.innerText = "密码格式不正确"
            setTimeout(function () {
                box.style.display = "none";
            }, 3000)
        }
    }
}